<template>
	<view>
		<view class="settle_box">
		  <label  class="radio" @click="toggleAll">
		    <radio :checked="flag"  color="#C00000" /><text></text>
        全选
		  </label>
     <view class="total_price" :style="{width:'332rpx',paddingLeft:'60rpx'}">
     合计:<text :style="{color:'red'}">￥{{total2}}</text>
      </view>
      <view class="set_btn" @click="settle">
       结算({{total}})
      </view>
		</view>
	</view>
</template>

<script>
  import {mapState,mapMutations} from 'vuex'
	export default {
		data() {
			return {
				flag:true,
        total2:0,
        n:3,
        timmer:''
			};
		},
    created() {
      this.formatToal()
      console.log(this.cart)
    },
    computed:{
      ...mapState('m_cart',['cart','total','addressInfo']),
      ...mapState('m_user',['token']),
       ...mapState('m_user',['jumpType']),
    },
    watch:{
      total:{
        handler(newname,oldname){
          this.flag=!this.cart.some(i=>{
            return i.goods_state==false
          })
          this.formatToal()
        },
        deep:true
      }
    },
    methods:{
      ...mapMutations('m_user',['updataType']),
      formatToal(){
        var totals=0;
        this.cart.forEach(i=>{
          if(i.goods_state){
            totals+=i.goods_count*i.goods_price
          }
        })
        this.total2=totals.toFixed(2)
      },
      toggleAll(){
        this.flag=!this.flag
        console.log('flag',this.flag)
        this.$emit('toggleAll',this.flag)
              this.formatToal()
              this.$store._mutations['m_cart/total1'][0]()
      },
      settle(){
        if(!this.total) return uni.$showMsg('请选择要购买的商品')
        if(!this.addressInfo)return uni.$showMsg('请选择地址')
        if(!this.token) return this.to_login()
      uni.showToast({
        title:'有事加微信哈哈哈哈❤(3秒后自动关闭)',
        image:'/static/vx.jpg',
        duration:3000
      })
      },
      to_login(){
        this.n=3
  this.timmer= setInterval(()=>{
      uni.showToast({
        // 不展示任何图标
        icon: 'none',
        // 提示的消息
        title: '请登录后再结算！' + this.n + ' 秒后自动跳转到登录页',
        // 为页面添加透明遮罩，防止点击穿透
        mask: true,
        // 1.5 秒后自动消失
        duration: 1500
      })
      if(this.n<=0){
        clearInterval(this.timmer)
        uni.switchTab({
          mask:true,
          url:'/pages/my/my',
          success:()=>{
            this.updataType({
                openType:'switchTab',
                from:'/pages/cart/cart'
            })
          }
        })
      }
     this.n--
      
    },1000)
      },
    }
	}
</script>

<style lang="scss">
.settle_box{
  background-color: white;
  width: 100%;
  height: 100rpx;
  display: flex;

  align-items: center;
  .radio{
    vertical-align: middle;
  }
  .set_btn{
    background-color: #C00000;
    height: 100%;
    padding: 0 20px;
    color: #FFFFFF;
    line-height: 100rpx;
  }
}
</style>
